<!--
 * @Author: hyq
 * @LastEditors: hyq
 * @Description: 
 * @Date: 2023-12-05 09:53:31
-->
<template>
  <view class="content">
    <image class="logo" src="/static/logo.png" />
    <view class="text-area">
      <text class="title uno-text-40rpx uno-font-600">{{ title }}</text>
      <text class="text-50rpx">主要</text>
    </view>

    <view class="theme.themeClass">
      <!-- 通用设置 {{ theme.isDark }}-->
      暗黑模式切换
      <view>
        <!-- <button @click="modifyHanlder">切换</button> -->
        <nut-button type="primary">主要按钮</nut-button>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue'
const title = ref('Hello')

// import { useModifyTheme } from '@/stores/theme'
import { onShow } from '@dcloudio/uni-app'
// const theme = useModifyTheme()
// const modifyHanlder = () => {
//   // console.log(theme.$state)
//   theme.modifyThemeHanlder(!theme.$state.isDark)
//   theme.setNavigationBarColorHandler()
// }
onShow(() => {
  // theme.setNavigationBarColorHandler()
})
</script>

<style scoped lang="scss">
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.logo {
  height: 200rpx;
  width: 200rpx;
  margin-top: 200rpx;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50rpx;
}

.text-area {
  display: flex;
  justify-content: center;
}

.title {
  font-size: 36rpx;
  color: #8f8f94;
}
</style>
